<template>
    <div class="container">
121
    </div>
</template>

<script >
import { onBeforeMount, onMounted } from 'vue';

export default{
    name:"App",
    setup(){
        // 挂载前
        onBeforeMount(()=>{
            console.log("dom挂载前钩子函数",document.querySelector(".container"))
            // 此时document.querySelector(".container")是拿不到dom元素的 结果为null
        })
        // 挂载后
        onMounted(()=>{
            console.log("dom挂载前钩子函数1",document.querySelector(".container"));
        })
        // 在vue3中可以对同一个实例同时使用多个挂载后的钩子函数，vue2中不能使用
        onMounted(()=>{
            console.log("dom挂载前钩子函数2",document.querySelector(".container"));
        })
    }
}
</script>

<style lang="scss" scoped>

</style>